<template>
  <div>
    <van-address-edit
      :area-list="areaList"
      show-postal
      show-set-default
      show-search-result
      :area-columns-placeholder="['请选择', '请选择', '请选择']"
      @save="onSave"
      @change-area="changeArea"
    />
  </div>
</template>

<script setup>
import { Toast } from "vant";
import { areaList } from "@vant/area-data";
import { incAddress } from "@/api";
import { ref } from "vue";
import { useRouter } from "vue-router";
const $router = useRouter();

const areaCode = ref("");

// 获取完整地址编码
const changeArea = (value) => {
  areaCode.value = value.map((item) => item.code).join("-");
};

const onSave = async (value) => {
  value.country = value.county;
  value.areaCode = areaCode.value;
  let data = await incAddress(value);
  let { status, message } = data;
  if (!status) {
    $router.back();
  }
  Toast(message);
};
</script>
